<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0, user-scalable=no">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="renderer" content="webkit">
  <meta http-equiv="Cache-Control" content="no-siteapp">
  <title>基本信息</title>
  <link rel="stylesheet" href="./static/css/mdui.css">
  <link rel="stylesheet" href="./static/css/docs.css">
</head>
<body class="mdui-drawer-body-left mdui-appbar-with-toolbar mdui-theme-primary-blue mdui-theme-accent-pink mdui-loaded">
<header class="mdui-appbar mdui-appbar-fixed">
  <div class="mdui-toolbar mdui-color-theme">
    <span class="mdui-btn mdui-btn-icon mdui-ripple mdui-ripple-white" mdui-drawer="{target: '#main-drawer', swipe: true}"><i class="mdui-icon material-icons">menu</i></span>
    <a href="./index.html" class="mdui-typo-headline mdui-hidden-xs">员工培训系统</a>
      <a href="" class="mdui-typo-title">基本信息</a>
    <div class="mdui-toolbar-spacer"></div>
    <div class="mdui-col-xs-5 mdui-col-md-3">
      <div class="mdui-textfield mdui-textfield-expandable mdui-float-right ">
        <button class="mdui-textfield-icon mdui-btn mdui-btn-icon"><i class="mdui-icon material-icons">search</i></button>
        <input class="mdui-textfield-input" type="text" placeholder="搜索"/>
        <button class="mdui-textfield-close mdui-btn mdui-btn-icon"><i class="mdui-icon material-icons">close</i></button>
      </div>
    </div>
    <span class="mdui-btn mdui-btn-icon mdui-ripple mdui-ripple-white" mdui-dialog="{target: '#dialog-docs-theme'}" mdui-tooltip="{content: '设置主题'}"><i class="mdui-icon material-icons">color_lens</i></span>
    
  <meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0, user-scalable=no">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="renderer" content="webkit">
  <meta http-equiv="Cache-Control" content="no-siteapp">
  </div>
</header>

<div class="mdui-drawer" id="main-drawer">
  <div class="mdui-list" mdui-collapse="{accordion: true}" style="margin-bottom: 76px;">
    <div class="">
      <a  href="./indexTeacher.html" class="mdui-collapse-item-header mdui-list-item mdui-ripple">
        <i class="mdui-list-item-icon mdui-icon material-icons mdui-text-color-blue">home</i>
        <div class="mdui-list-item-content">首页</div>
      </a>
    </div>

    <div class="mdui-collapse-item mdui-collapse-item-open">
      <div class="mdui-collapse-item-header mdui-list-item mdui-ripple">
        <i class="mdui-list-item-icon mdui-icon material-icons mdui-text-color-deep-orange">assignment_ind</i>
        <div class="mdui-list-item-content">个人信息</div>
        <i class="mdui-collapse-item-arrow mdui-icon material-icons">keyboard_arrow_down</i>
      </div>
      <div class="mdui-collapse-item-body mdui-list">
        <a href="./baseInfoTeacher.html" class="mdui-list-item mdui-ripple mdui-list-item-active">基本信息</a>
        <a href="./passwordChangeTeacher.html" class="mdui-list-item mdui-ripple">密码修改</a>
      </div>
    </div>
    <div class="mdui-collapse-item">
      <div class="mdui-collapse-item-header mdui-list-item mdui-ripple">
        <i class="mdui-list-item-icon mdui-icon material-icons mdui-text-color-green">publish</i>
        <div class="mdui-list-item-content">发布实训</div>
        <i class="mdui-collapse-item-arrow mdui-icon material-icons">keyboard_arrow_down</i>
      </div>
      <div class="mdui-collapse-item-body mdui-list">
        <a href="./trainingList.html" class="mdui-list-item mdui-ripple">已发布实训</a>
        <a href="./trainingPush.html" class="mdui-list-item mdui-ripple ">发布新实训</a>
      </div>
    </div>

    <div class="mdui-collapse-item">
      <div class="mdui-collapse-item-header mdui-list-item mdui-ripple">
        <i class="mdui-list-item-icon mdui-icon material-icons mdui-text-color-purple">grade</i>
        <div class="mdui-list-item-content">实训评分</div>
        <i class="mdui-collapse-item-arrow mdui-icon material-icons">keyboard_arrow_down</i>
      </div>
      <div class="mdui-collapse-item-body mdui-list">
        <a href="./trainingNoGrade.html" class="mdui-list-item mdui-ripple">未评分</a>
        <a href="./trainingGrade.html" class="mdui-list-item mdui-ripple ">已评分</a>
      </div>
    </div>
  </div>
</div>

<a id="anchor-top"></a>

<div class="mdui-container doc-container">
  <div class="mdui-clearfix mdui-typo">
    <h1 class="doc-title mdui-text-color-theme mdui-col-md-6 mdui-col-md-12 mdui-p-x-0" style="margin-bottom: 0">基本信息</h1>
  </div>
  <div class="mdui-typo mdui-clearfix mdui-m-y-4">
    <div class="mdui-col-md-6">
      <div class="mdui-clearfix">
        <div class="mdui-col-xs-6 mdui-col-md-5" style="line-height: 60px;font-size: 20px;text-align: right;">员工岗位：</div>
        <div class="mdui-col-xs-6" style="position: relative;top: 12px">
         <!--  <select class="mdui-select" mdui-select>
            <option value="1">岗位1</option>
            <option value="2">岗位2</option>
            <option value="3">岗位3</option>
            <option value="4">岗位4</option>
          </select> -->
          <input list="station" class="mdui-textfield-input" />
          <datalist id="station" >
            <option value="岗位1">岗位1</option>
            <option value="岗位2">岗位2</option>
            <option value="岗位3">岗位3</option>
            <option value="岗位3">岗位4</option>
          </datalist>
        </div>
      </div>
      <div class="mdui-clearfix">
        <div class="mdui-col-xs-6 mdui-col-md-5" style="line-height: 60px;font-size: 20px;text-align: right;">员工工号：</div>
        <div class="mdui-col-xs-6" style="position: relative;top: 12px">
          <!-- <select class="mdui-select" mdui-select>
            <option value="1">工号1</option>
            <option value="2">工号2</option>
            <option value="3">工号3</option>
            <option value="4">工号4</option>
          </select> -->
          <input list="number" class="mdui-textfield-input" />
          <datalist id="number" >
            <option value="工号1">工号1</option>
            <option value="工号2">工号2</option>
            <option value="工号3">工号3</option>
            <option value="工号4">工号4</option>
          </datalist>
        </div>
      </div>
      <div class="mdui-clearfix">
        <div class="mdui-col-xs-6 mdui-col-md-5" style="line-height: 60px;font-size: 20px;text-align: right;">姓名：</div>
        <div class="mdui-col-xs-6">
          <div class="mdui-textfield">
            <input class="mdui-textfield-input" type="text"/>
          </div>
        </div>
      </div>
      <div class="mdui-clearfix">
        <div class="mdui-col-xs-6 mdui-col-md-5" style="line-height: 60px;font-size: 20px;text-align: right;">性别：</div>
        <div class="mdui-col-xs-6" style="position: relative;top: 12px">
          <select class="mdui-select" mdui-select>
            <option value="1">男</option>
            <option value="2">女</option>
          </select>
        </div>
      </div>
      <div class="mdui-clearfix">
        <div class="mdui-col-xs-6 mdui-col-md-5" style="line-height: 60px;font-size: 20px;text-align: right;">生日：</div>
        <div class="mdui-col-xs-6">
          <div class="mdui-textfield">
            <input class="mdui-textfield-input" id="birthday" type="text" placeholder="" />
          </div>
        </div>
      </div>
      <div class="mdui-clearfix">
        <div class="mdui-col-xs-6 mdui-col-md-5" style="line-height: 60px;font-size: 20px;text-align: right;">地址：</div>
        <div class="mdui-col-xs-6">
          <div class="mdui-textfield">
            <input class="mdui-textfield-input" type="email"/>
          </div>
        </div>
      </div>
      <div class="mdui-clearfix">
        <div class="mdui-col-xs-6 mdui-col-md-5" style="line-height: 60px;font-size: 20px;text-align: right;">邮箱：</div>
        <div class="mdui-col-xs-6">
          <div class="mdui-textfield">
            <input class="mdui-textfield-input" type="email" />
          <div class="mdui-textfield-error">邮箱格式错误</div>
          </div>
        </div>
      </div>
      <div class="mdui-clearfix">
        <div class="mdui-col-xs-6 mdui-col-md-5" style="line-height: 60px;font-size: 20px;text-align: right;">电话：</div>
        <div class="mdui-col-xs-6">
          <div class="mdui-textfield">
            <input class="mdui-textfield-input" type="text" pattern="^1[3|4|5|7|8]\d{9}$" placeholder="" />
          <div class="mdui-textfield-error">电话格式错误</div>
          </div>
        </div>
      </div>
      <div class="mdui-clearfix">
        <div class="mdui-col-xs-6 mdui-col-md-5" style="line-height: 60px;font-size: 20px;text-align: right;">企业：</div>
        <div class="mdui-col-xs-6" style="position: relative;top: 12px">
          <input list="company" class="mdui-textfield-input" />
          <datalist id="company" >
            <option value="企业1">企业1</option>
            <option value="企业2">企业2</option>
            <option value="企业3">企业3</option>
            <option value="企业4">企业4</option>
          </datalist>
        </div>
      </div>
      <div class="mdui-clearfix">
        <div class="mdui-col-xs-6 mdui-col-md-5" style="line-height: 60px;font-size: 20px;text-align: right;">部门：</div>
        <div class="mdui-col-xs-6" style="position: relative;top: 12px">
          <input list="section" class="mdui-textfield-input" />
          <datalist id="section" >
            <option value="部门1">部门1</option>
            <option value="部门2">部门2</option>
            <option value="部门2">部门3</option>
            <option value="部门4">部门4</option>
          </datalist>
        </div>
      </div>
    </div>
    <div class="mdui-col-xs-12 mdui-col-md-6">
      <div class="mdui-clearfix">
        <div class="mdui-col-xs-8 mdui-col-offset-xs-2 mdui-col-md-4 mdui-p-t-1" style="min-width: 168px;border: 1px solid #eee;">
          <img src="./static/img/card.jpg" alt="">
        </div>
      </div>
      <div class="mdui-clearfix mdui-col-xs-8 mdui-col-offset-xs-2 mdui-col-md-4">
        <input type="file" id="uploadAvatars" hidden="">
        <button class="mdui-btn mdui-btn-raised mdui-col-xs-12 mdui-col-md-12 mdui-m-t-1" id="uploadBtn">上传照片</button>
      </div>
    </div>
  </div>
  <div class="mdui-typo mdui-clearfix mdui-m-y-4">
    <button class="mdui-col-xs-8 mdui-col-offset-xs-2 mdui-col-md-2 mdui-btn mdui-btn-raised mdui-ripple mdui-color-theme-accent mdui-m-t-2 " id="noticePush">提交</button>
    <button class="mdui-col-xs-8 mdui-col-offset-xs-2 mdui-col-offset-md-1 mdui-col-md-2 mdui-btn mdui-btn-raised mdui-ripple mdui-color-theme-accent mdui-m-t-2" id="noticePush">修改</button>
  </div>
</div>


<div class="mdui-dialog" id="dialog-docs-theme">
  <div class="mdui-dialog-title">设置文档主题</div>
  <div class="mdui-dialog-content">

    <p class="mdui-typo-title">主题色</p>
    <div class="mdui-row-xs-1 mdui-row-sm-2 mdui-row-md-3">
      <div class="mdui-col">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-layout" value="" checked="">
          <i class="mdui-radio-icon"></i>
          Light
        </label>
      </div>
      <div class="mdui-col">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-layout" value="dark">
          <i class="mdui-radio-icon"></i>
          Dark
        </label>
      </div>
    </div>

    <p class="mdui-typo-title mdui-text-color-theme">主色</p>
    <form class="mdui-row-xs-1 mdui-row-sm-2 mdui-row-md-3">
      <div class="mdui-col mdui-text-color-amber">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="amber">
          <i class="mdui-radio-icon"></i>
          Amber
        </label>
      </div>
      <div class="mdui-col mdui-text-color-blue">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="blue" checked="">
          <i class="mdui-radio-icon"></i>
          Blue
        </label>
      </div>
      <div class="mdui-col mdui-text-color-blue-grey">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="blue-grey">
          <i class="mdui-radio-icon"></i>
          Blue Grey
        </label>
      </div>
      <div class="mdui-col mdui-text-color-brown">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="brown">
          <i class="mdui-radio-icon"></i>
          Brown
        </label>
      </div>
      <div class="mdui-col mdui-text-color-cyan">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="cyan">
          <i class="mdui-radio-icon"></i>
          Cyan
        </label>
      </div>
      <div class="mdui-col mdui-text-color-deep-orange">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="deep-orange">
          <i class="mdui-radio-icon"></i>
          Deep Orange
        </label>
      </div>
      <div class="mdui-col mdui-text-color-deep-purple">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="deep-purple">
          <i class="mdui-radio-icon"></i>
          Deep Purple
        </label>
      </div>
      <div class="mdui-col mdui-text-color-green">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="green">
          <i class="mdui-radio-icon"></i>
          Green
        </label>
      </div>
      <div class="mdui-col mdui-text-color-grey">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="grey">
          <i class="mdui-radio-icon"></i>
          Grey
        </label>
      </div>
      <div class="mdui-col mdui-text-color-indigo">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="indigo">
          <i class="mdui-radio-icon"></i>
          Indigo
        </label>
      </div>
      <div class="mdui-col mdui-text-color-light-blue">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="light-blue">
          <i class="mdui-radio-icon"></i>
          Light Blue
        </label>
      </div>
      <div class="mdui-col mdui-text-color-light-green">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="light-green">
          <i class="mdui-radio-icon"></i>
          Light Green
        </label>
      </div>
      <div class="mdui-col mdui-text-color-lime">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="lime">
          <i class="mdui-radio-icon"></i>
          Lime
        </label>
      </div>
      <div class="mdui-col mdui-text-color-orange">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="orange">
          <i class="mdui-radio-icon"></i>
          Orange
        </label>
      </div>
      <div class="mdui-col mdui-text-color-pink">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="pink">
          <i class="mdui-radio-icon"></i>
          Pink
        </label>
      </div>
      <div class="mdui-col mdui-text-color-purple">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="purple">
          <i class="mdui-radio-icon"></i>
          Purple
        </label>
      </div>
      <div class="mdui-col mdui-text-color-red">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="red">
          <i class="mdui-radio-icon"></i>
          Red
        </label>
      </div>
      <div class="mdui-col mdui-text-color-teal">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="teal">
          <i class="mdui-radio-icon"></i>
          Teal
        </label>
      </div>
      <div class="mdui-col mdui-text-color-yellow">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="yellow">
          <i class="mdui-radio-icon"></i>
          Yellow
        </label>
      </div>
    </form>

    <p class="mdui-typo-title mdui-text-color-theme-accent">强调色</p>
    <form class="mdui-row-xs-1 mdui-row-sm-2 mdui-row-md-3">
      <div class="mdui-col mdui-text-color-amber">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-accent" value="amber">
          <i class="mdui-radio-icon"></i>
          Amber
        </label>
      </div>
      <div class="mdui-col mdui-text-color-blue">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-accent" value="blue">
          <i class="mdui-radio-icon"></i>
          Blue
        </label>
      </div>
      <div class="mdui-col mdui-text-color-cyan">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-accent" value="cyan">
          <i class="mdui-radio-icon"></i>
          Cyan
        </label>
      </div>
      <div class="mdui-col mdui-text-color-deep-orange">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-accent" value="deep-orange">
          <i class="mdui-radio-icon"></i>
          Deep Orange
        </label>
      </div>
      <div class="mdui-col mdui-text-color-deep-purple">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-accent" value="deep-purple">
          <i class="mdui-radio-icon"></i>
          Deep Purple
        </label>
      </div>
      <div class="mdui-col mdui-text-color-green">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-accent" value="green">
          <i class="mdui-radio-icon"></i>
          Green
        </label>
      </div>
      <div class="mdui-col mdui-text-color-indigo">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-accent" value="indigo">
          <i class="mdui-radio-icon"></i>
          Indigo
        </label>
      </div>
      <div class="mdui-col mdui-text-color-light-blue">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-accent" value="light-blue">
          <i class="mdui-radio-icon"></i>
          Light Blue
        </label>
      </div>
      <div class="mdui-col mdui-text-color-light-green">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-accent" value="light-green">
          <i class="mdui-radio-icon"></i>
          Light Green
        </label>
      </div>
      <div class="mdui-col mdui-text-color-lime">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-accent" value="lime">
          <i class="mdui-radio-icon"></i>
          Lime
        </label>
      </div>
      <div class="mdui-col mdui-text-color-orange">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-accent" value="orange">
          <i class="mdui-radio-icon"></i>
          Orange
        </label>
      </div>
      <div class="mdui-col mdui-text-color-pink">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-accent" value="pink" checked="">
          <i class="mdui-radio-icon"></i>
          Pink
        </label>
      </div>
      <div class="mdui-col mdui-text-color-purple">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-accent" value="purple">
          <i class="mdui-radio-icon"></i>
          Purple
        </label>
      </div>
      <div class="mdui-col mdui-text-color-red">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-accent" value="red">
          <i class="mdui-radio-icon"></i>
          Red
        </label>
      </div>
      <div class="mdui-col mdui-text-color-teal">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-accent" value="teal">
          <i class="mdui-radio-icon"></i>
          Teal
        </label>
      </div>
      <div class="mdui-col mdui-text-color-yellow">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-accent" value="yellow">
          <i class="mdui-radio-icon"></i>
          Yellow
        </label>
      </div>
    </form>

  </div>
  <div class="mdui-divider"></div>
  <div class="mdui-dialog-actions">
    <button class="mdui-btn mdui-ripple mdui-float-left" mdui-dialog-cancel="">恢复默认主题</button>
    <button class="mdui-btn mdui-ripple" mdui-dialog-confirm="">ok</button>
  </div>
</div>

<script src="https://cdn.bootcss.com/jquery/3.1.0/jquery.min.js"></script>
<script src="./static/js/laydate/laydate.js"></script>
<script src="./static/js/mdui.min.js"></script>
<script>var $$ = mdui.JQ;</script>
<script src="./static/js/highlight.pack.js"></script>
<script src="./static/js/smooth-scroll.min.js"></script>
<script src="./static/js/holder.min.js"></script>
<script src="./static/js/base.js"></script>

<script>

 $$('#uploadBtn').on('click', function () {
   document.getElementById('uploadAvatars').click();
 });
$$('#uploadAvatars').on('change', function () {
    var res = $(this).val().split('\\');
    var filename = res.reverse()[0];
    mdui.dialog({
      title: '注意：',
      content: '确认上传文件「' + filename + ' 」?',
      buttons: [
        {
          text: '取消'
        },
        {
          text: '确认',
          onClick: function(inst){
            mdui.alert('点击确认按钮的回调');
          }
        }
      ]
    });
 });
  laydate.render({
    elem: '#birthday' //指定元素
  });
</script>
</body>
</html>